<!DOCTYPE html>
<html lang="en">

<head>
    <title>登录 / 注册</title>
    <#include "/lx/activity/components/meta.html" />
    <#include "/lx/activity/components/stylesheets.html" />
    <link rel="stylesheet" href="/lx/activity/stylesheets/validateMobile.css?v=2">
</head>

<body>
    <div id="app">
        <img src='/lx/activity/assets/img/login-bg.png' class='top-bg'></img>
        <div class='form'>
            <div class='field'>
                <!-- <div class="field-icon">
                    <i class="am-icon-user"></i>
                </div> -->
                <input placeholder='请输入手机号' class='field-input' type="number" v-model="mobile"></input>
            </div>
            <div class='field'>
                <!-- <div class="field-icon">
                    <i class="am-icon-lock"></i>
                </div> -->
                <input placeholder='请输入验证码' class='field-input2' v-model="code"></input>
                <button class='am-btn am-btn-default get-code theme-background-color1' @click="sendCode">获取<span v-if="countDown"> ({{ countDown }})</span></button>
            </div>
        </div>
        <div class='submit-wrap'>
            <button class='am-btn am-btn-default submit theme-background-color1' @click="next">下一步</button>
        </div>
    </div>
    <#include "/lx/activity/components/scripts.html" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9/crypto-js.min.js"></script>
    <script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data() {
            return {
                mobile: '',
                code: '',
                countDown: 0,
                intervalId: null
            }
        },
        mounted: function() {},
        watch: {
            countDown: function(val) {
                if (!this.countDown) {
                    clearInterval(this.intervalId);
                }
            }
        },
        methods: {
            sendCode() {
                if (this.countDown) {
                    return;
                }
                var self = this;
                if (!self.mobile) {
                    msg("请输入手机号");
                    return;
                }
                if (!self.isMobileAvailable(self.mobile)) {
                    msg("请输入正确的手机号");
                    return;
                }
                var url = '/lx/mini/user/sendCode';
                var params = {
                    mobile: self.mobile
                };
                var success = function(res) {
                    msg("验证码发送成功");
                    self.countDown = 60;
                    self.intervalId = setInterval(function() {
                        self.countDown--;
                    }, 1000);
                }
                var fail = function() {};
                var complete = function() {};
                request(url, params, success, fail, complete);
            },
            next() {
                var self = this;
                if (!self.mobile) {
                    msg("请输入手机号");
                    return;
                }
                if (!self.code) {
                    msg("请输入验证码");
                    return;
                }
                // var url = '/lx/mini/user/validateMobile';
                var url = '/lx/mini/user/bind'
                var params = {
                    account: self.mobile,
                    code: self.code
                };
                var success = function(res) {
                    console.log(res);
                    // if (res.info.status != 0) {
                    //     window.location.href = '/lx/mini/activity';
                    // } else {
                    //     window.location.href = '/lx/mini/user/signUp?uid=' + res.info.id;
                    // }
                    if (res.info.isRegistered == 1) {
                        var ref = '${ref!""}'
                        if (ref != '') {
                            window.location.href = ref;
                        }else{
                            window.location.href = '/lx/mini/activity';
                        }
                    } else {
                        window.location.href = '/lx/mini/user/signUp?account=' + res.info.account;
                    }
                }
                var fail = function() {};
                var complete = function() {};
                request(url, params, success, fail, complete);
            },
            isMobileAvailable(mobile) {
                var myreg = /^[1][0-9]{10}$/;
                return myreg.test(mobile);
            }
        }
    })
    </script>
    <script>
    // wx.ready(function() {
    //     initWXShare()
    // })
    </script>
</body>

</html>